<template>
  <div id="app">
    <MyHeader hot="hot"/>
    <button @click="getComponents">获取组件的ref</button>
    <hr>
    <Count ref="countVue" v-bind="person"/>
    <hr>
    <Count/>
    <br>

  </div>
</template>

<script>
import MyHeader from "@/components/MyHeader";
import Count from "@/components/Count";

export default {
  name: 'App',
  components: {
    MyHeader,
    Count
  },
  methods:{
    getComponents(){
      console.log(this.$refs)
      console.log(this.$refs.countVue)
      console.log(this.$refs.countVue.$refs.countHead)
    }
  },
  data(){
    return{
      hot:true,
      person:{
        name:"wdh",
        age:18,
        hobby:'anime',
        count:2
      },
    }
  }
}
</script>

<style>

</style>
